<template>
	<div class="home">
		<SectionOne></SectionOne>
		<SectionTwo></SectionTwo>
		<SectionThree></SectionThree>
		<SectionFour></SectionFour>
	</div>
</template>

<script>
import SectionOne from "./components/SectionOne.vue";
import SectionTwo from "./components/SectionTwo.vue";
import SectionThree from "./components/SectionThree.vue";
import SectionFour from "./components/SectionFour.vue";
import { mapActions } from "vuex";
export default {
	name: "Home",
	components: {
		SectionOne,
		SectionTwo,
		SectionThree,
		SectionFour,
	},
	methods: {},
	mounted() {
		this.$store.dispatch("home/getTodayData");
	},
};
</script>
<style lang="less" scoped>
.home {
	width: 100%;
	min-width: 1130px;
}
</style>
<style lang="less">
.top-title {
	text-align: left;
	margin-bottom: 20px;
	> b {
		display: inline-block;
		width: 0px;
		height: 16px;
		border-left: 2px solid #438afe;
		border-right: 2px solid #438afe;
		vertical-align: middle;
	}
	.title {
		margin-left: 20px;
		font-size: 16px;
		line-height: 16px;
		font-weight: bold;
		color: #333;
		vertical-align: middle;
		&:hover {
			color: 438afe;
			cursor: pointer;
			user-select: none;
		}
	}
}
.bg-purple {
	background-color: #fff;
}
.el-row {
	margin-bottom: 20px;
}
.grid-content {
	border-radius: 4px;
	padding: 24px;
	overflow: hidden;
}
</style>
